<template>
  <div ref="config">
    <div class="row">
      <el-input v-model="searchInfo" placeholder=""></el-input>
      <el-button type="primary" icon="el-icon-search" class="search-btn"
        >搜索</el-button
      >
   
    </div>

    <el-table :data="searchRes">

      <el-table-column
        header-align="center"
        align="center"
        prop="account"
        label="账号"
        width="180"
      >
      </el-table-column>
      <el-table-column
        header-align="center"
        align="center"
        prop="name"
        label="名称"
        width="180"
      >
      </el-table-column>
      <el-table-column
        header-align="center"
        align="center"
        prop="manager"
        label="负责人"
      >
      </el-table-column>
      <el-table-column
        header-align="center"
        align="center"
        prop="phone"
        label="联系电话"
      >
      </el-table-column>
    </el-table>
    <el-form
      ref="form"
      :model="form"
      label-width="100px"

    >
      <el-form-item label="权限管理">
        <el-checkbox-group v-model="form.jurisdiction">
          <el-checkbox label="信息发布"></el-checkbox>
          <el-checkbox label="信息维护"></el-checkbox>
          <el-checkbox label="销控管理"></el-checkbox>
          <el-checkbox label="促销管理"></el-checkbox>
        </el-checkbox-group>
      </el-form-item>
      <el-form-item label="建议价格">
   <el-row :gutter="10">
      <el-col :span="8">
        <el-form-item label="最低价"
          ><el-input
            v-model="form.minPrice"
            placeholder=""
            class="inline-input"
          ></el-input>
        </el-form-item></el-col>
        <el-col :span="8">   <el-form-item label="最高价"
          ><el-input
            v-model="form.maxPrice"
            placeholder=""
            class="inline-input"
          ></el-input> </el-form-item></el-col>
    </el-row>
      </el-form-item>
 
     
       
    </el-form>
  </div>
</template>

<script>
export default {
    props: {
      callbackdata: {
        type: Object,
        default: {}
      }
    },
  watch:{
    form:{
      deep:true,
      handler:function(){
        this.$store.commit('set_agent_config',this.form)
      }
    }
  },
  methods: {
    handleCurrentChange(val) {
      this.selectedFrim = val;
      this.form.choosen = val
   
    },
  },
  data() {
    return {
      form: {
        jurisdiction: [],
        minPrice: "",
        maxPrice: "",
        choosen:null
      },
      selectedFrim: "",
      searchInfo: "",
      searchRes: [
        {
          account: 1,
          name: "鹏鹏代理",
          manager: "力PP",
          phone: "1234435",
        },
        {
          account: 2,
          name: "BB代理",
          manager: "力BB",
          phone: "1234435",
        },
      ],
    };
  },
};
</script>

<style scoped>
.search-btn {
  margin-left: 2rem;
}
.row {
  margin: auto;
  display: flex;
  width: 70%;
  max-width: 800px;
}
.row .el-input {
}
.el-radio-group {
  display: block;
  width: 100%;
}

.el-radio {
  margin-top: 1rem;

  width: 100%;
  display: flex;
}
.el-form {
  margin-top: 1rem;
}
.inline-input {
  flex-shrink: 1;
}
.price {
  display: flex;
}
</style>
